import React from 'react'
import { Tabs,Table,Modal,Badge } from 'antd'
import moment from "moment"

const TabPane = Tabs.TabPane;
const confirm = Modal.confirm

class List extends React.Component {
	constructor(props) {
		super(props)
		
		this.state = {
			
		}
	}
	
	callback = key =>{
//		console.log(key)
	}
	edit  = (record, e,text) => {
		const params ={
			id:record.id,
			operatingType:2
		}
		const {showPage,showDet,onComponent,isFileComponent,showModals} = this.props
		if(e == 1){
			showPage(params)
			
		}else if(e == 2){
			showModals("new")
			showDet(params)

		}else if(e == 3){
			showModals("update")
			showDet(params)
		}
		
	}
	editComponent = (record,e,text) =>{
		const {showModals} = this.props
		showModals()
	}
	async pageChange(pagination) {
	    await this.props.onPageChange(pagination);
	    this.newPage = pagination.current;
	}
	
	render(){
		const {menu,list,loading,pagination} = this.props
		const columns1 = [
			{
				title: "申请人",
				dataIndex: "applyName",
				key: "applyName",
				render: (text, record) => {
					const datas = text.split("#")
					const ary = []
					datas.map((item, i) => {
						ary.push(
							<p>{item}</p>
						)
					})
					return ary
				}
			},{
				title:"身份证号码",
				dataIndex:"idcard",
				key:"idcard",
				render: (text, record) => {
					if(!text){
						return null
					}
					const datas = text.split("#")
					const ary = []
					datas.map((item, i) => {
						ary.push(
							<p>{item}</p>
						)
					})
					return ary
				}
			},{
				title:"公证事项",
				dataIndex:"notarialMatters",
				key:"notarialMatters",
				render: (text, record) => {
					const datas = text.split("#")
					const ary = []
					datas.map((item, i) => {
						ary.push(
							<p>{item}</p>
						)
					})
					return ary
				}
			},{
				title:"公证号码",
				dataIndex:"notaryNumber",
				key:"notaryNumber",
				render: (text, record) => {
					const datas = text.split("#")
					const ary = []
					datas.map((item, i) => {
						ary.push(
							<p>{item}</p>
						)
					})
					return ary
				}
			},{
				title:"承办人",
				dataIndex:"contractorUserName",
				key:"contractorUserName",
			},{
				title:"建档人",
				dataIndex:"createdUserName",
				key:"createdUserName",
			},{
				title: "收件日期",
				dataIndex: "createdTime",
				key: "createdTime",
				render: (text, record) => {
					return (
						<p>
							{
								moment(record.createdTime).format("YYYY-MM-DD")
							}
						</p>
					)
				}
			},{
				title: "公证日期",
				dataIndex: "notarizationAt",
				key: "notarizationAt",
				render: (text, record) => {
					return (
						<p>
							{
								moment(record.notarizationAt).format("YYYY-MM-DD")
							}
						</p>
					)
				}
			},{
				title: "档案状态",
				dataIndex: "state",
				key: "state",
				render: (text, record) => {
					return (
						<div>
							{record.state == 0 ?
								<p>未归档</p> :
								<p>已归档</p>
							}
						</div>
					)
				}
			},
			{
				title: '操作',
				dataIndex: 'applicationState1',
				key: 'applicationState1',
				render: (text, record) => {
					return (
						<div>
							{menu == 0 ?
								<div>
									{
										record.state == 0 ?
											<span onClick={this.edit.bind(null, record, 1)} style={{ marginRight: 5 }}><a href="#">销毁</a></span> :
											<span onClick={this.edit.bind(null, record, 2)} style={{ marginRight: 5 }}><a href="#">申请销毁</a></span>
									}
								</div> :
								menu == 1 ?
									<div>
											<span onClick={this.edit.bind(null, record, 3)} style={{ marginRight: 5 }}><a href="#">审核</a></span> 
									</div> : 
								menu == 2 ?
									<div>
										{
											record.applicationState == 1 ?
											<span onClick={this.edit.bind(null, record, 1)} style={{ marginRight: 5 }}><a href="#">销毁</a></span>:
											<span style={{ marginRight: 5,color:"gray" }}>销毁</span>
										}
									</div>:
									<div>
											<span style={{ marginRight: 5 }}><a href="#">查看</a></span> 
									</div>
							}

						</div>
					)
				}
			}
		];
		const columns = [
			{
				title: "档案年度",
				dataIndex: "documentYear",
				key: "documentYear",
			}, {
				title: "公证事项",
				dataIndex: "notarialMatters",
				key: "notarialMatters",
				render: (text, record) => {
					const datas = text.split("#")
					const ary = []
					datas.map((item, i) => {
						ary.push(
							<p>{item}</p>
						)
					})
					return ary
				}
			},
			{
				title: "申请人",
				dataIndex: "applyName",
				key: "applyName",
				render: (text, record) => {
					const datas = text.split("#")
					const ary = []
					datas.map((item, i) => {
						ary.push(
							<p>{item}</p>
						)
					})
					return ary
				}
			},
			{
				title: "收件日期",
				dataIndex: "createdTime",
				key: "createdTime",
				render: (text, record) => {
					return (
						<p>
							{
								moment(record.createdTime).format("YYYY-MM-DD")
							}
						</p>
					)
				}
			},
			{
				title: "公证日期",
				dataIndex: "notarizationAt",
				key: "notarizationAt",
				render: (text, record) => {
					return (
						<p>
							{
								moment(record.notarizationAt).format("YYYY-MM-DD")
							}
						</p>
					)
				}
			},
			{
				title: "承办人",
				dataIndex: "contractorUserName",
				key: "contractorUserName",
			},
			{
				title: "建档人",
				dataIndex: "createdUserName",
				key: "createdUserName",
			},
			{
				title: "所属机构",
				dataIndex: "organizationName",
				key: "organizationName",
			},
			{
				title: "申请提交日期",
				dataIndex: "applicationCreatedTime",
				key: "applicationCreatedTime",
				render: (text, record) => {
					return (
						<p>
							{
								moment(record.applicationCreatedTime).format("YYYY-MM-DD")
							}
						</p>
					)
				}
			},
			{
				title: "申请结果",
				dataIndex: "applicationState",
				key: "applicationState",
				render: (text, record) => {
					return (
						<div>
							{record.applicationState == 0 ?
								<div><Badge status="processing" /><span>待审核</span></div> :
								record.applicationState == 1 ?
									<div><Badge status="success" /><span>通过</span></div> :
									record.applicationState == 2 ?
										<div><Badge status="error" /><span>拒绝</span></div> :
										<div><Badge status="success" /><span>已通过</span></div>
							}
						</div>
					)
				}
			},
			{
				title: "审核结果",
				dataIndex: "applicationState",
				key: "applicationState",
				render: (text, record) => {
					return (
						<div>
							{record.applicationState == 0 ?
								<div><Badge status="processing" /><span>待审核</span></div> :
								record.applicationState == 1 ?
									<div><Badge status="success" /><span>通过</span></div> :
									record.applicationState == 2 ?
										<div><Badge status="error" /><span>拒绝</span></div> :
										<div><Badge status="success" /><span>已通过</span></div>
							}
						</div>
					)
				}
			},
			{
				title: "档案状态",
				dataIndex: "state",
				key: "state",
				render: (text, record) => {
					return (
						<div>
							{record.state == 0 ?
								<p>未归档</p> :
								<p>已归档</p>
							}
						</div>
					)
				}
			},
			{
				title: '操作',
				dataIndex: 'applicationState1',
				key: 'applicationState1',
				render: (text, record) => {
					return (
						<div>
							{menu == 0 ?
								<div>
									{
										record.state == 0 ?
											<span onClick={this.edit.bind(null, record, 1)} style={{ marginRight: 5 }}><a href="#">销毁</a></span> :
											<span onClick={this.edit.bind(null, record, 2)} style={{ marginRight: 5 }}><a href="#">申请销毁</a></span>
									}
								</div> :
								menu == 1 ?
									<div>
											<span onClick={this.edit.bind(null, record, 3)} style={{ marginRight: 5 }}><a href="#">审核</a></span> 
									</div> : 
								menu == 2 ?
									<div>
										{
											record.applicationState == 1 ?
											<span onClick={this.edit.bind(null, record, 1)} style={{ marginRight: 5 }}><a href="#">销毁</a></span>:
											<span style={{ marginRight: 5,color:"gray" }}>销毁</span>
										}
									</div>:
									<div>
											<span style={{ marginRight: 5 }}><a href="#">查看</a></span> 
									</div>
							}

						</div>
					)
				}
			}
		];

		columns.map((item, i) => {
			if (item.title == "档案状态") {
				menu == 0 ? '' : delete columns[i]
			}
			if (item.title == "申请提交日期") {
				menu != 0 ? '' : delete columns[i]
			}
			if (item.title == "申请结果") {
				menu == 2 ? '' : delete columns[i]
			}
			if (item.title == "审核结果") {
				menu == 3 ? '' : delete columns[i]
			}
			if (item.title == "操作") {
				menu != 3 ? '' : delete columns[i]
			}
		})
		return(
			<div>
				{menu == 0 ?
					<Table
						columns={columns1}
						dataSource={list}
						loading={loading}
						onChange={this.pageChange.bind(this)}
						pagination={pagination}
						rowKey={record => record.endAt}
					/>:
					<Table
						columns={columns}
						dataSource={list}
						loading={loading}
						onChange={this.pageChange.bind(this)}
						pagination={pagination}
						rowKey={record => record.endAt}
					/>
				}
				{/* {menu == 0?
					<Table
			          columns={columns}
			          dataSource={list}
			          loading={loading}
			          onChange={this.pageChange.bind(this)}
			          pagination={pagination1}
			        />:
			     menu == 1?
			        <Table
			          columns={columns1}
			          dataSource={list}
			          loading={loading}
			          onChange={this.pageChange.bind(this)}
			          pagination={pagination1}
			        />:
			     menu == 2?
			     	<Table
			          columns={columns2}
			          dataSource={list}
			          loading={loading}
			          onChange={this.pageChange.bind(this)}
			          pagination={pagination1}
			        />:
			        <Table
			          columns={columns3}
			          dataSource={list}
			          loading={loading}
			          onChange={this.pageChange.bind(this)}
			          pagination={pagination1}
			        />
				} */}
				
			</div>
		)
	}
}

export default List